import { createApp } from 'vue'
import App from './App.vue'

// import HelloOneVue from './components/HelloOne.vue'
// import HelloTwoVue from './components/HelloTwo.vue'
// import HelloThreeVue from './components/HelloThree.vue'
// import HelloFourVue from './components/HelloFour.vue'
// import HelloWorldVue from './components/HelloWorld.vue'

const moduleList = require.context('./components', false, /\.vue$/)
console.log(moduleList, '===') // 加载函数
console.log(moduleList.keys()) // ['文件路径key']
console.log(moduleList('./HelloFour.vue')) // 调用 moduleList(模块路径) => 该模块内容
const components = {}
// 使用 moduleList.keys() 做循环
moduleList.keys().forEach(key => {
  // 组件的名字
  const comName = key.split('/')[1].split('.')[0]
  console.log('comName', comName)
  // 组件的内容
  const comContext = moduleList(key).default
  components[comName] = comContext 
})

console.log('components', components)


const app = createApp(App)

// 基于 components 做全局的组件注册
for(let comName in components) {
  app.component(comName, components[comName])
}


app.mount('#app')

